<template>
	<div>
		<el-drawer custom-class="wxkj-drawer" :title="'邀请' + name + '参加面试'" :before-close="drawerClose"
			:visible.sync="drawerShow" size="600">
			<div class="drawer-content">
				<div class="ml30 mb20">
					<el-checkbox v-model="form.emailFlag">同时向<span v-html="name" />发送邮件通知</el-checkbox>
				</div>
				<div class="ml30 mb20">应聘职位：{{ jobName }}</div>
				<el-form ref="form" :model="form" :rules="formRules" label-width="120px">
					<el-form-item label="面试形式：">
						<el-checkbox v-model="interviewType">视频面试</el-checkbox>
					</el-form-item>
					<el-form-item label="会议室选择：" v-if="interviewType" required prop="roomId">
						<el-select v-model="form.roomId" clearable style="width: 300px;" placeholder="请选择会议室"
							@change="getBatchList">
							<el-option v-for="(item,index) in roomList" :key="index" :label="item.label"
								:value="item.value" />
						</el-select>
					</el-form-item>
					<el-form-item label="面试批次：" required prop="batchId" v-if="form.roomId">
						<el-col :span="16" class="mr5">
							<el-select v-model="form.batchId" filterable placeholder="请选择" style="width: 100%" @change="changeBatch">
								<el-option v-for="item in batchList" :key="item.id" :label="item.batchName"
									:value="item.id" />
							</el-select>
						</el-col>
						<el-col :span="2" class="mr5 link-type">
							<span @click="showBatchDialog(null)">新增</span>
						</el-col>
						<el-col v-if="form.batchId" :span="2" class="mr5 link-type">
							<span @click="showBatchDialog(form.batchId)">编辑</span>
						</el-col>
						<el-col v-if="form.batchId" :span="2" class="mr5 link-type">
							<el-popconfirm confirm-button-text="确定" cancel-button-text="取消" icon="el-icon-info"
								icon-color="red" title="确定要删除此批次吗？" @onConfirm="delBatch">
								<span slot="reference">删除</span>
							</el-popconfirm>
						</el-col>
					</el-form-item>
					<el-form-item label="面试编号：" required prop="interviewNo" v-if="form.batchId">
						<el-input-number v-model="form.interviewNo" :min="1" label="请输入面试编号"></el-input-number>
					</el-form-item>


					<el-form-item label="面试开始时间：" required prop="time">
						<el-date-picker v-model="form.time" type="datetime" placeholder="选择日期" class="width100"
							format="yyyy-MM-dd HH:mm" default-time="08:00:00" value-format="yyyy-MM-dd HH:mm"  />
							<!-- :picker-options="pickerOptions" -->
					</el-form-item>
					<el-form-item v-if="interviewType" label="面试结束时间：" required prop="interviewEndTime">
						<el-date-picker v-model="form.interviewEndTime" type="datetime" default-time="20:00:00"
							placeholder="选择日期" format="yyyy-MM-dd HH:mm" value-format="yyyy-MM-dd HH:mm" 
							class="width100" />
							<!-- :picker-options="pickerOptionsInterviewEndTime" -->
					</el-form-item>

					<el-form-item label="联系人：" required prop="contactId">
						<el-col :span="16" class="mr5">
							<el-select v-model="form.contactId" filterable placeholder="请选择" style="width: 100%"
								@change="selectedContact">
								<el-option v-for="item in contactList" :key="item.id" :label="item.userName"
									:value="item.id" />
							</el-select>
						</el-col>
						<el-col :span="2" class="mr5 link-type">
							<span @click="showContactsDialog(null)">新增</span>
						</el-col>
						<el-col v-if="form.contactId" :span="2" class="mr5 link-type">
							<span @click="showContactsDialog(form.contactId)">编辑</span>
						</el-col>
						<el-col v-if="form.contactId" :span="2" class="mr5 link-type">
							<el-popconfirm confirm-button-text="确定" cancel-button-text="取消" icon="el-icon-info"
								icon-color="red" title="确定要删除此联系人吗？" @onConfirm="delContact">
								<span slot="reference">删除</span>
							</el-popconfirm>
						</el-col>
					</el-form-item>

					<el-form-item label="备注信息：">
						<el-input v-model="form.remark" type="textarea" placeholder="请填写备注信息" />
					</el-form-item>
					<el-form-item label="面试官：">
						<el-col :span="24">
							<el-select v-model="form.peopleIds" multiple filterable clearable placeholder="请选择"
								style="width: 100%">
								<el-option v-for="item in peopleList" :key="item.id" :label="item.name"
									:value="item.userId" />
							</el-select>
						</el-col>
						<!-- <el-col :span="4" class="link-type tr pr20">
                           <span @click="showColleagueDialog()">管理</span>
                        </el-col> -->
					</el-form-item>
					<el-form-item class="fr">
						<el-button @click="drawerClose">取消</el-button>
						<el-button type="primary" :loading="submitLoading" @click="submitForm">确定</el-button>
					</el-form-item>
				</el-form>
			</div>
		</el-drawer>
		<colleague ref="colleague" />
		<contacts ref="contacts" type="面试" @refresh="getcontactList" />
		<batchs ref="batchs" type="批次" @refresh="getBatchList" />

	</div>
</template>

<script>
	import colleague from './dialog/colleague'
	import contacts from './dialog/contacts'
	import batchs from './dialog/batchs'
	import {
		listContacts,
		delContacts,
		oneContacts,
		interviewInvitation,
		editState
	} from '@/api/personnel'
	import {
		batchList, batchDel, batchView
	} from '@/api/conferenceRoomBatch'
	import {
		roomNoPageList
	} from '@/api/conferenceRoom'

	import {
		list
	} from '@/api/colleague'
	export default {
		components: {
			colleague,
			contacts,
			batchs
		},
		data() {
			var validateInterviewEndTime = (rule, value, callback) => {
				if (new Date(value).getTime() - new Date(this.form.time).getTime() < 15 * 1000 * 60) {
					callback(new Error('面试周期最少15分钟'))
				}
				// else if(new Date(value).getTime() - new Date(this.form.time).getTime() > 1440 * 1000 * 60){
				// 	callback(new Error('面试周期不能大于一天'))
				// }
				 else {
					callback()
				}
			}
			return {
				drawerShow: false,
				name: '',
				jobName: '',
				interviewType: false,
				contactList: [], // 联系人列表
				contactsInfo: {}, // 选中的联系人信息
				peopleList: [],
				submitLoading: false,
				pickerOptions: {
					disabledDate(time) {
						return time.getTime() < Date.now() - 8.64e7;
					}
				},
				pickerOptionsInterviewEndTime: {
					disabledDate(time) {
						return time.getTime() < Date.now() - 8.64e7;
					}
				},
				formRules: {
					time: [{
						required: true,
						message: '请选择面试时间'
					}],
					roomId:[{
						required: true,
									message: '请选择会议室'
					}],
					batchId:[{
						required: true,
									message: '请选择面试批次'
					}],
					interviewNo:[{
						required: true,
									message: '请输入面试编号'
					}],
					interviewEndTime: [{
						required: true,
						message: '请选择结束时间'
					}, {
						validator: validateInterviewEndTime,
						trigger: 'blur'
					}],
					contactId: [{
						required: true,
						message: '请选择联系人'
					}],
					peopleIds: [{
						required: true,
						message: '请选择面试官'
					}]
				},
				form: {
					userId: '',
					jobId: '',
					type: 0,
					onLineState: 0, // 未开始
					time: '', // 面试时间
					interviewEndTime: '', // 面试结束时间
					remark: '', // 备注
					emailFlag: false, // 是否发邮件通知
					contactId: '', // 联系人id
					peopleIds: '', // 抄送同事
					companyId: '', // 公司id
					outLineState: 0, // 待处理
					messageFlag: false
				},
				nomidifyStutus: false,
				roomList: [], //会议室列表
				batchList: [] //批次列表
			}
		},
		// 生命周期 - 创建完成（可以访问当前this实例）
		created() {

		},
		// 生命周期 - 挂载完成（可以访问DOM元素）
		mounted() {},
		// 销毁
		destroyed() {},
		// 方法
		methods: {
      //选中批次信息
      changeBatch(){
        if (this.form.batchId) {
          batchView({
						id: this.form.batchId
					}).then((res) => {
						this.form.time = res.result.beginTime;
						this.form.interviewEndTime = res.result.endTime;
						this.form.interviewNo = res.result.maxNo;
					})
        }
      },
			// 选中联系人信息
			selectedContact() {
				if (this.form.contactId) {
					oneContacts({
						id: this.form.contactId
					}).then((res) => {
						this.contactsInfo = res.result
					})
				}
			},
			// 显示
			show(name, id, jobName, jobId, companyId, reId, dataId, nomidifyStutus) { // 最后一个参数 添加面试信息后 不修改状态
				this.name = name
				this.jobName = jobName
				this.form.userId = id
				this.form.jobId = jobId
				this.form.companyId = companyId
				this.form.resumeId = reId
				this.dataId = dataId // 投递记录id
				this.interviewType = false
				list({
					pageSize: 10000,
					pageNo: 1
				}).then(res => {
					this.peopleList = res.result.records
				})
				this.getcontactList();
				this.getBatchList(this.form.roomId);
				this.roomList = [];
				roomNoPageList({}).then(response => {
					var roomList = response.result
					for (var i in roomList) {
						this.roomList.push({
							'label': roomList[i].roomName,
							'value': roomList[i].id
						});
					}
				})
				this.drawerShow = true
				// console.log(nomidifyStutus)
				if (nomidifyStutus) this.nomidifyStutus = true
			},
			getBatchList() {
				if (!this.form.roomId) {
					return;
				}
				batchList({
					roomId: this.form.roomId,
					pageSize: 1000
				}).then((res) => {
					this.batchList = res.result.records
				})
			},
			// 联系人信息列表
			getcontactList() {
				listContacts({
					companyId: this.form.companyId,
					pageSize: 1000
				}).then((res) => {
					this.contactList = res.result.records
				})
			},
      delBatch(){
        batchDel({
					id: this.form.batchId
				}).then((res) => {
					this.form.batchId = ''
					this.getBatchList()
				})
      },
			// 删除联系人
			delContact() {
				delContacts({
					id: this.form.contactId
				}).then((res) => {
					this.form.contactId = ''
					this.getcontactList()
				})
			},
			drawerClose() {
				this.submitLoading = false
				this.$nextTick(() => {
					this.form = {
						userId: '',
						jobId: '',
						type: 0,
						onLineState: 0, // 未开始
						time: '', // 面试时间
						interviewEndTime: '', // 面试结束时间
						remark: '', // 备注
						emailFlag: false, // 是否发邮件通知
						contactId: '', // 联系人id
						peopleIds: '', // 抄送同事
						companyId: '', // 公司id
						outLineState: 0, // 待处理
						messageFlag: false
					}
					this.$refs.form.resetFields()
				})
				this.drawerShow = false
				this.$emit('refresh')
			},
			// 提交
			submitForm() {
				this.$refs.form.validate((valid) => {
					if (valid) {
						this.submitLoading = true
						const form = JSON.parse(JSON.stringify(this.form))
						form.type = this.interviewType ? 1 : 0
						form.location = this.contactsInfo.interviewAddr

						if (form.peopleIds) {
							form.peopleIds = form.peopleIds.join(',')
						}
						interviewInvitation(form).then((res) => {
							if (!this.nomidifyStutus) {
								// 修改状态
								editState({
									dataId: this.dataId,
									state: 4
								}).then(res => {
									this.$message({
										message: '邀请已发出',
										type: 'success'
									})
									this.submitLoading = false
									this.drawerClose()
								}).catch(err => {
									this.submitLoading = false
								})
							} else {
								// 不修改状态
								this.$message({
									message: '邀请已发出',
									type: 'success'
								})
								this.submitLoading = false
								this.drawerClose()
							}
						}).catch(err => {
							this.submitLoading = false
						})
					}
				})
			},
			// 打开同事信息弹窗
			showColleagueDialog(id) {
				this.$refs.colleague.show('1')
			},
			// 打开联系人弹窗
			showContactsDialog(id) {
				this.$refs.contacts.show(id, this.form.companyId)
			},
			// 打开批次弹窗
			showBatchDialog(id) {
				this.$refs.batchs.show(id, this.form.roomId)
			}
		}
	}
</script>
<style lang="scss" scoped>
</style>
